<template>
    <div class="app-container merchantBox">
        <el-table v-loading="loading" :data="list" element-loading-text="Loading" border fit style="width:100%">

        <el-table-column align="center" label="手机号码" width="200">
            <template slot-scope="scope">{{ scope.row.mobile }}</template>
        </el-table-column>

        <el-table-column label="商家名" width="500" align="center">
            <template slot-scope="scope">{{ scope.row.company }}</template>
        </el-table-column>

        <el-table-column label="联系人" align="center" width="279">
            <template slot-scope="scope">
            <span>{{ scope.row.real_name}}</span>
            </template>
        </el-table-column>

        <el-table-column label="注册时间" align="center" width="300">
            <template slot-scope="scope">
            <span>{{ scope.row.create_time}}</span>
            </template>
        </el-table-column>

        <el-table-column label="审核状态" align="center" width="180">
            <template slot-scope="scope">
            <span>{{ scope.row.status == '0' ? '待审核' : scope.row.status == 1 ?'已通过' : '驳回' }}</span>
            </template>
        </el-table-column>

        <el-table-column align="center" prop="create_time" label="操作" width="130" fixed="right">
            <template slot-scope="scope">
            <div class="optionAll">
                <el-button
                v-if="scope.row.status"
                class="operation"
                size="mini"
                @click="submintProve(scope.row.agent_id)"
                plain
                >审核</el-button>
            </div>
            </template>
        </el-table-column>
        </el-table>

        <!-- 分页 -->
        <el-pagination
        class="pageBox"
        background
        layout="prev, pager, next"
        :total="pageTotal"
        :page-size="20"
        v-if="pageShow"
        @current-change="handleCurrentChange"
        ></el-pagination>
    </div>
</template>

<script>
export default {
    name: "agentCheck",
    components: {},
    data() {
        return {
            list: null,
            loading: false,
            pageTotal: 0,
            pageShow: false
        };
    },

    methods: {
        // 数据初始化
        defaultFn(currentPage) {
        this.loading = true;
        this.$http
            .get("/web/agent/index", {
            params: {
                token: localStorage.getItem("user_token"),
                pageSize: 20,
                page: currentPage
            }}).then(response => {
                if (response.data.status == 'success') {
                    this.list = response.data.data.list;
                    this.pageTotal = response.data.data.pagination.total;

                    if (this.pageTotal > 20) {
                        this.pageShow = true;
                    } else {
                        this.pageShow = false;
                    }

                    this.loading = false;
                } else {
                    this.loading = false;
                }
            })
            .catch(error => {
                this.loading = false;
            });
        },
        // 触发分页
        handleCurrentChange(val) {
        	this.defaultFn(val);
        },

        submintProve(value){
			this.$router.push({name: 'checkProveInfo', query:{id: value}})
		}
    },

  mounted() {
    this.defaultFn();
  }
};
</script>


<style scoped lang='scss'>
.merchantBox {
  margin: 40px;
  .addUser {
    margin-bottom: 20px;
  }
  .optionAll {
    float: left;
    display: flex;
    justify-content: space-between;
    .operation {
      width: 110px;
    }
  }
}
.pageBox {
  text-align: center;
  margin-top: 30px;
}
</style>
